邊緣人:要約哪一天好呢~
UIDatePicker: (將max跟min改成過去時間)
date picker可以在介面中加入日期、時間的捲軸,讓使用者可以依此輸入時間日期甚至是時間區間(例如倒數計時器)等資訊。
(圖片來源:https://developer.apple.com/documentation/uikit/uidatepicker)
date picker跟button同樣支援輔助使用,若VoiceOver被允許運作,當使用者觸碰到date picker命運轉輪的時候,語音就會回饋title、特性以及相關說明。例如使用者在鬧鐘裡的新增鬧鐘觸碰小時捲軸的時候,系統會回饋以下語音:
"2 o'clock. Picker item. Adjustable. Swipe up or down with one finger to adjust the value.”
另外,UIDatePicker的形式是不給客製化的,只能捲時間跟日期。
如果你想要卷whatever u want,你需要設定一個list裝你要捲的內容,然後使用UIPickerView。
跟UIButton一樣,你可以從Library裡拉一個UIDatePicker,也可以用程式初始化一個UIDatePicker:
let newDatePicker = UIDatePicker()
let constraitDatePicker = UIDatePicker(frame: CGRect(x: 0, y: UIScreen.main.bounds.height - 250, width: UIScreen.main.bounds.width , height: 200))
這在前面有介紹過,UIDatePicker的mode有4種,分為Date/Time/Date and Time/Count Down,使用以下程式碼宣告:
newDatePicker.datePickerMode = UIDatePicker.Mode.dateAndTime
newDatePicker.datePickerMode = UIDatePicker.Mode.countDownTimer
Locale是指所在地區,因為日期及時間的顯示方式會依照地區的不同而不一樣。
DatePicker跟Button一樣支援國際化,如果想要DatePicker國際化的話,就不需要特別設定Locale,在default的狀況下,系統會自動偵測使用者的語言與區域來顯示datePicker。
但如果你94要全世界用你app的人都只能使用特定語言區域的DatePicker的話,設定locale的方法如下:
newDatePicker.locale = Locale(identifier: "Chinese")
newDatePicker.locale = Locale(identifier: "French")
如果你的DatePicker與時間相關的話,可以設定一個time interval,決定你的分鐘捲軸間隔。需要注意的是,因為一小時是60分鐘,所以你可以設定的time interval必須是60的公因數,最小是1,最大是30,預設值是1。
newDatePicker.minuteInterval = 5
不知道大家有沒有發現,Date Picker一開始顯示的時間,預設就是啟動Date Picker的current time。
然後大家就知道我寫這篇文章的時間點的,科技人真是沒有秘密啊~
但其實Date Picker也可以指定剛開始顯示的時間喔~首先要設定一個date components:
let dateComponents = DateComponents(calendar: Calendar.current, timeZone: nil, era: nil, year: 1989, month: 10, day: 7, hour: 6, minute: 45, second: nil, nanosecond: nil, weekday: nil, weekdayOrdinal: nil, quarter: nil, weekOfMonth: nil, weekOfYear: nil, yearForWeekOfYear: nil)
dateComponents裡的參數都是optional,所以你不指定的話直接拿掉也可以,只是一方面我覺得很有趣,一方面也給大家看看有哪些參數可以設定,所以就用nil來替代了XD還有什麼nanosecond的也太酷了吧~
接下來再把這個DateComponent的Date指定給DatePicker:
newDatePicker.setDate(dateComponents.date! , animated: true)
初始值就是我生日了~原來我出生的時候是星期六啊~
啊!不小心暴露年齡了QQ哭爆
我平常做人應該沒有很失敗吧!大家不要拿我的生辰八字去做壞事啊~
這裡date要加驚嘆號,是因為當我指定dateComponents的date時,他會從dateComponent裡抓出date所需要的資料。但如剛剛所說,dateComponents裡的參數全是optional,他不一定抓得到資料,代表date的型態也是optional,所以需要加驚嘆號強迫她unwrap,才可以指定給setDate使用。
constraints限制了可選擇日期的區間,一樣先設定2個dateComponents
let minimumDateConponent = DateComponents(calendar: Calendar.current, year: 2019, month: 9, day: 1)
let maximumDateConponent = DateComponents(calendar: Calendar.current, year: 2019, month: 9, day: 30)
這裡有一個需要注意的部分是:maximum的日期不能比minimum還早,否則會發生錯誤。
接下來再把時間指定給個別的參數:
newDatePicker.minimumDate = minimumDateConponent.date!
newDatePicker.maximumDate = maximumDateConponent.date!
從demo中可以看到,除了我設定的區間9/1-9/30以外,其他不能選擇的都變成灰色了,所以如果我滑到10/18,日期就會跳到離10/18最近的日期區間9/30。
所...所以UIDatePicker把min跟max都設成過去的時間,是想跟我約會但害羞嗎?
真是個傲嬌的孩子呢~
如果DatePicker的mode是CountDownTimer的話,可以設定timer來指定countdown timer的初始值,預設值為1分鐘。
使用countDownDuration這個變數,時間單位為秒(但在畫面上會以分鐘顯示)。
newDatePicker.countDownDuration = 290
秒數轉換分鐘是採無條件捨去,像範例中的290秒只顯示4分鐘。
通常countDownTimer會搭配Timer(倒數計時器,非countDownDuration),不過如果以這個時間開始倒數,是會倒數290秒還是240秒呢?其實我也不清楚。
所以接下來會稍微離題介紹一下timer,並使用DatePicker與timer做個小小的倒數器。
都在讀文件好久沒實作app了,我好興奮啊~~